<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
</head>
<style type="text/css"> 
.zhong{
     text-align:center;
    margin-left:auto;
    margin-right:auto;
    width:300px;
    height: 120px;
    border: #000 1px solid;
}
</style>
<script>
function chooseOne(chk){
	//先取得同name的chekcBox的集合物件
	var obj = document.getElementsByName("select");
	for (i=0; i<obj.length; i++){
	//判斷obj集合中的i元素是否為cb，若否則表示未被點選
	if (obj[i]!=chk) obj[i].checked = false;
	//若要至少勾選一個的話，則把上面那行else拿掉，換用下面那行
	else obj[i].checked = true;
	}
	}
function clean()
{
	document.getElementById("text1").value="";
	document.getElementById("text2").value="";
	var obj = document.getElementsByName("select");
	for (i=0; i<obj.length; i++){
	obj[i].checked = false;
	}
}
</script>
<body>
    <div class="zhong">
	<form action="dengluServlet" method="post">
	请输入用户名和密码并选择用户种别:
	<br> 用户名:
	<input type="text" name="name" id="text1"/>
	<br> 密码:
	<input type="text" name="password" id="text2"/>
	<br>
	<input type="checkbox" name="select" value="学生" onClick="chooseOne(this)">学生
	<input type="checkbox" name="select" value="教师" onClick="chooseOne(this)">教师
	<br>
	<input type="submit" value="登陆">     <input type="button" value="清空" onclick="clean()">
	</form>
	</div>
</body>
</html>